<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="../bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <title></title>
    <link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.css">
    <link href="../bootstrap-table/bootstrap-table.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="../bootstrap-select-1.13.14/dist/css/bootstrap-select.css">
    <link rel="stylesheet" href="../toastr/toastr.min.css">
    <link rel="stylesheet" href="../bootstrapvalidator-aae9288/dist/css/bootstrapValidator.css">
    <title>客户订单</title>

</head>
<body>
        <table id="data-table"></table>
    <script src="../jquery/jquery-3.5.1.min.js"></script>
    <script src="../bootstrap/js/bootstrap.js"></script>
    <script src="../bootstrap-table/bootstrap-table.min.js"></script>
    <script src="../bootstrap-select-1.13.14/dist/js/bootstrap-select.js"></script>
    <script src="../bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script src="../toastr/toastr.min.js"></script>
    <script src="../jquery-validation/jquery.validate.js"></script>
    <script src="../jquery-validation/messages_zh.js"></script>
    <script src="../bootstrapvalidator-aae9288/dist/js/bootstrapValidator.js"></script>
    <script src="../bootstrapvalidator-aae9288/dist/js/language/zh_CN.js"></script>
        <script>
            var guest_ids=[];
            $(document).ready(function () {


                initTable();
                function initTable() {
                    //让bookstraptable销毁
                    $("#data-table").bootstrapTable("destroy");
                    $("#data-table").bootstrapTable({
                        url: "/guest/selectAllGuest",
                        method: 'post', //请求方式（*）
                        toolbar: '#addBtn,#deleteMoreBtn',            //工具按钮用哪个容器
                        striped: true, //是否显示行间隔色
                        cache: false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                        pagination: true, //是否显示分页（*）
                        sortable: true, //是否启用排序
                        sortOrder: "asc", //排序方式
                        sidePagination: "client", //分页方式：client客户端分页，server服务端分页（*）
                        pageNumber: 1, //初始化加载第一页，默认第一页,并记录
                        pageSize: 8, //每页的记录行数（*）
                        pageList: [10, 20, 50, 100], //可供选择的每页的行数（*）
                        search: true, //是否显示表格搜索,模糊查询
                        strictSearch: false,//精确查询
                        // silent : true,// 刷新事件必须设置
                        showColumns: true, //是否显示所有的列（选择显示的列）
                        showRefresh: true, //是否显示刷新按钮
                        minimumCountColumns: 2, //最少允许的列数
                        clickToSelect: true, //是否启用点击选中行
                        //height: 1000,                      //表格高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
                        uniqueId: "id", //每一行的唯一标识，一般为主键列
                        showToggle: false, //是否显示详细视图和列表视图的切换按钮
                        cardView: false, //是否显示详细视图
                        detailView: false, //是否显示父子表
                        clickToSelect: true,    //是否启用点击选中行
                        // queryParams: queryParams,
                        columns: [

                            {
                                checkbox: true,

                            },
                            // {
                            //     field: 'guest_id',//JSon数据中的相应的key
                            //     title: '客户编号',//表头信息
                            //     sortable: true,
                            //
                            //     align: 'center',
                            //     valign: 'middle',
                            //},
                            {
                                field: 'guest_name',//JSon数据中的相应的key
                                title: '客户姓名',//表头信息
                                sortable: true,

                                align: 'center',
                                valign: 'middle',
                            },
                            {
                                field: 'guest_idcard',
                                title: '身份证号',
                                sortable: true,

                                align: 'center',
                                valign: 'middle',

                            },
                            {
                                field: 'guest_phone',
                                title: '手机号',
                                sortable: true,

                                align: 'center',
                                valign: 'middle',
                            },
                            {
                                field: 'room_id',
                                title: '房间号',
                                align: 'center',
                                sortable: true,
                                valign: 'middle',
                            },
                            {
                                field: 'guest_checkintime',
                                title: '入住时间',

                                align: 'center',
                                sortable: true,
                                valign: 'middle',
                            },
                            {
                                field: 'guest_checkouttime',
                                title: '退房时间',

                                align: 'center',
                                sortable: true,
                                valign: 'middle',
                            },
                            {
                                field: 'guest_paymoney',
                                title: '支付金额',

                                align: 'center',
                                sortable: true,
                                valign: 'middle',
                            }//,
                           // {
                                // title: '操作',
                                // align: 'center',
                                // valign: 'middle',
                               /// events: operateEvents,
                               //  formatter: function (e,value, row, index) {
                               //      return "<button class='btn btn-info updateGuest'><i class='fa fa-pencil-square-o' aria-hidden='true'></i> 编辑</button> <button class='btn btn-danger deleteGuest'> <i class='fa fa-trash' aria-hidden='true'></i> 删除</button>"
                               //          ;
                               //  }
                           // }
                        ],
                        onLoadSuccess: function (res) {
                            console.log(res);
                            //复选框的居中样式
                            $(".bs-checkbox").css({"text-align": 'center', "vertical-align": "middle"});
                        }, onLoadError: function (statusCode) {
                            return "加载失败了"
                        }, formatLoadingMessage: function () {
                            //正在加载
                            return "拼命加载中...";
                        }, formatNoMatches: function () {
                            //没有匹配的结果
                            return '无符合条件的记录';
                        }
                    });
                }
            });
                // var form = $('#ForAddandEditForm');
                // form.bootstrapValidator({
                //     message: '输入值不合法',
                //     feedbackIcons: {
                //         valid: 'glyphicon glyphicon-ok',
                //         invalid: 'glyphicon glyphicon-remove',
                //         validating: 'glyphicon glyphicon-refresh'
                //     },
                //     fields: {
                //         guest_name: {
                //             message: '用户名不合法',
                //             validators: {
                //                 notEmpty: {
                //                     message: '用户名不能为空'
                //                 },
                //                 stringLength: {
                //                     min: 2,
                //                     max: 30,
                //                     message: '请输入2到30个字符'
                //                 }//,
                                // regexp: {
                                //     regexp: /^[a-zA-Z0-9_\. \u4e00-\u9fa5 ]+$/,
                                //     message: '用户名只能由字母、数字、点、下划线和汉字组成 '
                                // }
                //             }
                //         }
                //         , guest_idcard: {
                //             validators: {
                //                 notEmpty: {
                //                     message: '身份证不能为空'
                //                 }
                //             }
                //         }, guest_phone: {
                //             validators: {
                //                 notEmpty: {
                //                     message: '手机号不能为空'
                //                 },
                //                 regexp: {
                //                     regexp: "^([0-9]{11})?$",
                //                     message: '手机号码格式错误'
                //                 }
                //             }
                //         }
                //     }
                // });

            //
            // window.operateEvents = {
            //     'click .updateGuest': function (e, value, row, index) {
            //         $("#guest_id").val(row.guest_id);
            //         $.ajax({
            //             url: "/guest/selectGuestById",
            //             type: "post",
            //             dataType: "json",
            //             data: {
            //                 guest_id: row.guest_id
            //             },
            //             success: function (res) {
            //                 console.log(res);
            //                 if (res.errorCode == 0) {
            //                     showModalforAddandEdit();
            //                     $("#guest_id").val(res.object.guest_id)
            //                     $("#guest_name").val(res.object.guest_name);
            //                     $("#guest_idcard").val(res.object.guest_idcard);
            //                     $("#guest_phone").val(res.object.guest_phone);
            //                     $("#guest_roomid").val(res.object.guest_roomid);
            //                 }
            //             }
            //         });
            //     },
            //
            //     //该点击事件需要将括号中的参数写全才可以显示出来
            //     'click .deleteGuest': function (e, value, row, index) {
            //         guest_id = row.guest_id;
            //         guest_ids[0] = row.guest_id;
            //         $("#deleteDialogMsg").html("确定要删除" + row.guest_roomid + "这条数据吗？");
            //         $("#myDeleteModal").modal("show");
            //     }
            // };
            // function showModalforAddandEdit() {
            //     var guest_id = $("#guest_id").val();
            //     if(guest_id!=""){
            //         $("#myModalLabelTitle").text("编辑入住");
            //         $("#addorEditBtn").text("编辑")
            //         $("#MyModalforAddandEdit").modal("show");
            //     }else{
            //         $("#myModalLabelTitle").text("添加入住");
            //         $("#addorEditBtn").text("添加")
            //         $("#MyModalforAddandEdit").modal("show");
            //     }
            // }

        </script>


</body>
</html>